function validate() {
var errMsg = "";
var result = true;
var fname = document.getElementById("fname").value;
if (!fname.match(/^[a-zA-Z]+$/)) {
errMsg += "Please enter your first name correctly.\n";
result = false;
}
if (errMsg) {
alert(errMsg);
}
if (result) {
function storeBooking(
fname
) {
sessionStorage.fname = fname;
}
function getBooking() {
if (sessionStorage.fname != undefined) {
document.getElementById("confirm_fname").textContent = sessionStorage.fname;
}
}
function prefillcard()
{
document.getElementById("fname").value = sessionStorage.fname;
}
window.addEventListener("DOMContentLoaded", prefillcard);
function init() {
var regForm = document.getElementById("regform");
regForm.onsubmit = validate;
}
<form action="apply.html" method="post" id="regform">
<label for="fname">First Name</label>
<input type="text" id="fname" name="firstname" placeholder="Your name.." required="required" maxlength="25" onkeypress="return (event.charCode > 64 && event.charCode < 91) || (event.charCode > 96 && event.charCode < 123) || (event.charCode==32)">
<input type="submit" value="Apply">
</form>
I've set up some code to auto-fill a form if the user had already filled the form in the same browser session and then revisited the form. The only problem is that there is a placeholder, which you need to delete before putting in an input, is there and I don't know how to get rid of it. "Undefined" comes up when you fill the form in the first time. How do I get rid of this?
Note: no jQuery or inline JavaScript.
To store values in session use
window.sessionStorage.setItem("Name", Value));
and to retrieve value from session use
window.sessionStorage.getItem("Name");
Sample code below
function prefillcard() {
if (window.sessionStorage.getItem("fname")) {
var fnm = window.sessionStorage.getItem("fname");
document.getElementById("fname").value = fnm;
}
}
and to set Session value use
var fnm = document.getElementById("fname").value;
window.sessionStorage.setItem("fname", fnm));